vant+compressorJs压缩图片并上传 |
您所在的位置：网站首页 › vant 拍照上传 › vant+compressorJs压缩图片并上传 |
|
1、安装Compressor.js https://cdn.bootcdn.net/ajax/libs/compressorjs/1.2.1/compressor.js2、HTML
3、方法 // 返回布尔值 beforeRead(file) { if (file.type !== 'image/jpeg' && file.type !== 'image/png' && file.type !== 'image/jpg') { Toast('请上传图片格式'); return false; } if(file.size1024*1024*25){ this.fileSize = file.size console.log('图片大小2',file.size) // Toast('请上传20M以下图片'); let that = this console.log('aaaaaaaaaaaaaaaaaaaaaaa',file) return new Promise((resolve) => { // compressorjs 默认开启 checkOrientation 选项 // 会将图片修正为正确方向 new Compressor(file, { quality: 1, success(result){ let file1 = new File([result], file.name, { type: file.type }) console.log("File对象", file1); that.uploadFile(file1) resolve(result); }, error(err) { console.log(err.message); }, }); }); } this.fileSize = file.size console.log('图片大小3',file.size) this.uploadFile(file) return true; },3、上传图片 uploadFile(file) { var formData = new FormData(); formData.append("pic", file); // formData.system=H5 this.$refs.loading.postForm("pwp/uploadpic", formData).then((res) => { // this.$refs.loading.loadingFlag--; if (res.status === "100000") { // fileUrl = res.data; this.fileUrl = res.data console.log('this.fileUrl',res); } else { Toast.fail("提交失败，请稍后重试"); } }); },
|
| CopyRight 2018-2019 办公设备维修网 版权所有 豫ICP备15022753号-3 |